import * as echarts from "echarts";

// 卡片数据
export const cardData = [
    {
        // 卡片样式
        cardStyle: {
            padding: "",
        },
        // 布局配置
        colLayout: {
            span: 24
        },
        data: [
            {
                cardId: 3,
                title: "重点关注地区",
                showSectionCondition: "",
                cardFilterOptions: [ // 卡片筛选项
                ],
                cardBodyConfig: {
                    type: "table", // 类型 echart/table
                    url: "/cardBodyAddressTable1", // 接口地址
                    style: {
                        height: 260
                    }, // 卡片主体样式
                    config: {
                        // 是否显示序号
                        showIndexColumn: true,
                        // 是否显示可选
                        showSelectColumn: false,
                        // 是否显示分页
                        showFooter: false,
                        // 表格数据
                        propsList: [
                            { prop: 'key1', label: '区域名称', align: 'left' },
                            { prop: 'key2', label: '饱和度', align: 'left' },
                            { prop: 'key3', label: '游客数', align: 'left' },
                            { prop: 'key4', label: '操作', align: 'left' },
                        ],
                        // 表格配置项
                        tableAttrConfig: {
                            // 是否显示边框
                            border: true,
                            // 是否显示统计
                            showSummary: false,
                            headerCellStyle: {
                                background: 'rgba(18, 68, 87, 0.54)',
                                color: '#fff',
                                fontFamily: 'PingFang SC',
                                fontSize: '12px',
                                fontStyle: 'normal',
                                fontWeight: '400',
                                borderRadius: "3px",
                                // borderRight: "2px solid #091520",
                                // boxSizing: "border-box"
                            },
                            cellStyle: {
                                fontSize: "12px",
                                color: "#BCCBCC",
                                backgroundColor: 'transparent',
                            }
                        }
                    }, // 卡片配置
                }
            }
        ]
    },
    {
        // 卡片样式
        cardStyle: {
            marginTop: "20px",
            marginBottom: "20px",
            background: "linear-gradient( 180deg, rgba(23,55,67,0.25) 0%, rgba(21,45,54,0.67) 100%)"
        },
        // 布局配置
        colLayout: {
            span: 24
        },
        data: [
            {
                cardId: 222,
                title: "",
                showSectionCondition: "",
                cardFilterOptions: [ // 卡片筛选项
                    { type: "areaTimeRange", url: "/static/cardLights.json", field: "cardLights" },
                ],
                cardBodyConfig: {
                    type: "echart", // 类型 echart/table
                    url: "/tesssssssssssst", // 接口地址
                    style: {
                        height: 280
                    }, // 卡片主体样式
                    config: {
                        tooltip: {
                            trigger: "axis",
                        },
                        legend: {
                            show: false
                        },
                        grid: {
                            left: '2%',
                            right: '2%',
                            top: "5%",
                            bottom: '5%',
                            containLabel: true
                        },
                        dataset: {
                            dimensions: ["label", "value"],
                            source: [
                                { label: '测试1', value: 1000 },
                                { label: '测试2', value: 888 },
                                { label: '测试3', value: 884 },
                                { label: '测试4', value: 600 },
                                { label: '测试5', value: 500 }
                            ]
                        },
                        dataZoom: [
                            {
                                show: true,
                                type: "inside",
                                endValue: 5,
                                xAxisIndex: [0, 1],  // 注意顺序，0 是主要的 xAxis
                            },
                        ],
                        xAxis: {
                            type: 'category',
                            axisLine: {
                                show: true,
                                lineStyle: {
                                    width: 1,
                                    color: "rgba(6,156,162,0.34)"
                                }
                            },
                            axisTick: {
                                show: false   // 隐藏 x 轴刻度线
                            },
                            axisLabel: {
                                color: '#BCCBCC',
                                fontSize: 10,
                                fontWeight: 400
                            },
                            splitLine: {
                                show: false
                            }
                        },
                        yAxis: {
                            type: 'value',
                            axisLine: {
                                show: false
                            },
                            axisTick: {
                                show: false   // y 轴刻度线默认显示，可省略
                            },
                            axisLabel: {
                                color: '#BCCBCC',
                                fontSize: 8,
                                fontWeight: 400
                            },
                            splitLine: {
                                show: true,  // 显示网格线
                                lineStyle: {
                                    color: "rgba(6,156,162,0.34)",  // 你可以调整颜色和透明度
                                    type: "solid"
                                }
                            }
                        },
                        series: [{
                            type: 'line',
                            symbol: 'circle',
                            symbolSize: 4,
                            lineStyle: {
                                color: '#FFF462',
                                width: 1
                            },
                            itemStyle: {
                                color: '#FFF462'
                            },
                            label: {
                                show: false,
                                position: 'top',
                                color: '#BBD2E9',
                                fontSize: 7,
                            },
                            encode: {
                                x: 'label',
                                y: 'value'
                            }
                        }]
                    }, // 卡片配置
                }
            }
        ]
    },
    {
        // 卡片样式
        cardStyle: {
            padding: "10px",
            background: "linear-gradient( 180deg, rgba(23,55,67,0.25) 0%, rgba(21,45,54,0.67) 100%)"
        },
        // 布局配置
        colLayout: {
            span: 8
        },
        data: [
            {
                cardId: 3,
                title: "来源分析",
                showSectionCondition: "",
                cardFilterOptions: [ // 卡片筛选项
                ],
                cardBodyConfig: {
                    type: "echart", // 类型 echart/table
                    url: "/cardBodyAddressTable1", // 接口地址
                    style: {
                        height: 300
                    }, // 卡片主体样式
                    config: {
                        tooltip: {
                            trigger: 'item'
                        },
                        color: ['#3265FF', '#00B6F2', '#05D9DA', '#B5F300', '#5EBD03', '#B5F300', '#FFBE00', '#FF8C17'],
                        dataset: {
                            dimensions: ['label', 'value'],
                            source: [
                                { label: '测试市1', value: 1000 },
                                { label: '测试市2', value: 888 },
                                { label: '测试市3', value: 884 },
                                { label: '测试市4', value: 600 },
                                { label: '测试市5', value: 500 },
                                { label: '测试市6', value: 400 },
                                { label: '测试市7', value: 300 },
                                { label: '测试市8', value: 200 },
                                { label: '测试市9', value: 100 },
                                { label: '测试市10', value: 50 }
                            ]
                        },
                        series: [
                            {
                                name: '',
                                type: 'pie',
                                radius: [35, 65],
                                center: ['50%', '50%'],
                                label: {
                                    show: true,
                                    formatter: '{b}: {d}%',
                                    color: '#BCCBCC',
                                    fontSize: 10,
                                    fontWeight: 400
                                },
                                labelLine: {
                                    show: true,
                                    length: 15,
                                    length2: 10,
                                    lineStyle: {
                                    }
                                },
                                itemStyle: {
                                    borderWidth: 2,
                                    borderColor: 'rgba(20, 48, 59, 0.75)'
                                },
                                encode: {
                                    itemName: 'label',
                                    value: 'value'
                                }
                            }
                        ]
                    },
                }
            },
            {
                cardId: 33,
                title: "出行方式分布",
                showSectionCondition: "",
                cardFilterOptions: [ // 卡片筛选项
                ],
                cardBodyConfig: {
                    type: "echart", // 类型 echart/table
                    url: "/cardBodyAddressTable1", // 接口地址
                    style: {
                        height: 300
                    }, // 卡片主体样式
                    config: {
                        tooltip: {
                            trigger: 'item'
                        },
                        color: ['#3265FF', '#00B6F2', '#05D9DA', '#B5F300', '#5EBD03', '#B5F300', '#FFBE00', '#FF8C17'],
                        dataset: {
                            dimensions: ['label', 'value'],
                            source: [
                                { label: '测试市1', value: 1000 },
                                { label: '测试市2', value: 888 },
                                { label: '测试市3', value: 884 },
                                { label: '测试市4', value: 600 },
                                { label: '测试市5', value: 500 },
                                { label: '测试市6', value: 400 },
                                { label: '测试市7', value: 300 },
                                { label: '测试市8', value: 200 },
                                { label: '测试市9', value: 100 },
                                { label: '测试市10', value: 50 }
                            ]
                        },
                        series: [
                            {
                                name: '',
                                type: 'pie',
                                radius: [35, 65],
                                center: ['50%', '50%'],
                                label: {
                                    show: true,
                                    formatter: '{b}: {d}%',
                                    color: '#BCCBCC',
                                    fontSize: 10,
                                    fontWeight: 400
                                },
                                labelLine: {
                                    show: true,
                                    length: 15,
                                    length2: 10,
                                    lineStyle: {
                                    }
                                },
                                itemStyle: {
                                    borderWidth: 2,
                                    borderColor: 'rgba(20, 48, 59, 0.75)'
                                },
                                encode: {
                                    itemName: 'label',
                                    value: 'value'
                                }
                            }
                        ]
                    },
                }
            },
            {
                cardId: 222,
                title: "每日客流统计",
                showSectionCondition: "",
                cardFilterOptions: [ // 卡片筛选项
                    { type: "areaTimeRange", url: "/static/cardLights.json", field: "cardLights" },
                ],
                cardBodyConfig: {
                    type: "echart", // 类型 echart/table
                    url: "/tesssssssssssst", // 接口地址
                    style: {
                        height: 280
                    }, // 卡片主体样式
                    config: {
                        tooltip: {
                            trigger: "axis",
                        },
                        legend: {
                            show: false
                        },
                        grid: {
                            left: '0%',
                            right: '0%',
                            top: "5%",
                            bottom: '5%',
                            containLabel: true
                        },
                        dataset: {
                            dimensions: ["label", "value"],
                            source: [
                                { label: '测试1', value: 1000 },
                                { label: '测试2', value: 888 },
                                { label: '测试3', value: 884 },
                                { label: '测试4', value: 600 },
                                { label: '测试5', value: 500 }
                            ]
                        },
                        dataZoom: [
                            {
                                show: true,
                                type: "inside",
                                endValue: 5,
                                xAxisIndex: [0, 1],  // 注意顺序，0 是主要的 xAxis
                            },
                        ],
                        xAxis: {
                            type: 'category',
                            axisLine: {
                                show: true,
                                lineStyle: {
                                    width: 1,
                                    color: "rgba(6,156,162,0.34)"
                                }
                            },
                            axisTick: {
                                show: false   // 隐藏 x 轴刻度线
                            },
                            axisLabel: {
                                color: '#BCCBCC',
                                fontSize: 10,
                                fontWeight: 400
                            },
                            splitLine: {
                                show: false
                            }
                        },
                        yAxis: {
                            type: 'value',
                            axisLine: {
                                show: false
                            },
                            axisTick: {
                                show: false   // y 轴刻度线默认显示，可省略
                            },
                            axisLabel: {
                                color: '#BCCBCC',
                                fontSize: 8,
                                fontWeight: 400
                            },
                            splitLine: {
                                show: true,  // 显示网格线
                                lineStyle: {
                                    color: "rgba(6,156,162,0.34)",  // 你可以调整颜色和透明度
                                    type: "solid"
                                }
                            }
                        },
                        series: [{
                            type: 'line',
                            symbol: 'circle',
                            symbolSize: 4,
                            lineStyle: {
                                color: '#FFF462',
                                width: 1
                            },
                            itemStyle: {
                                color: '#FFF462'
                            },
                            label: {
                                show: false,
                                position: 'top',
                                color: '#BBD2E9',
                                fontSize: 7,
                            },
                            encode: {
                                x: 'label',
                                y: 'value'
                            }
                        }]
                    }, // 卡片配置
                }
            }
        ]
    },
    {
        // 卡片样式
        cardStyle: {
            padding: "",
        },
        // 布局配置
        colLayout: {
            span: 24
        },
        data: [
            {
                cardId: 3,
                title: "",
                showSectionCondition: "",
                cardFilterOptions: [ // 卡片筛选项
                ],
                cardBodyConfig: {
                    type: "table", // 类型 echart/table
                    url: "/cardBodyAddressTable1", // 接口地址
                    style: {
                        height: 260
                    }, // 卡片主体样式
                    config: {
                        // 是否显示序号
                        showIndexColumn: true,
                        // 是否显示可选
                        showSelectColumn: false,
                        // 是否显示分页
                        showFooter: false,
                        // 表格数据
                        propsList: [
                            { prop: 'key1', label: '区域名称', align: 'left' },
                            { prop: 'key2', label: '来源地区名称', align: 'left' },
                            { prop: 'key3', label: '游客数', align: 'left' },
                            { prop: 'key4', label: '操作', align: 'left' },
                        ],
                        // 表格配置项
                        tableAttrConfig: {
                            // 是否显示边框
                            border: true,
                            // 是否显示统计
                            showSummary: false,
                            headerCellStyle: {
                                background: 'rgba(18, 68, 87, 0.54)',
                                color: '#fff',
                                fontFamily: 'PingFang SC',
                                fontSize: '12px',
                                fontStyle: 'normal',
                                fontWeight: '400',
                                borderRadius: "3px",
                                // borderRight: "2px solid #091520",
                                // boxSizing: "border-box"
                            },
                            cellStyle: {
                                fontSize: "12px",
                                color: "#BCCBCC",
                                backgroundColor: 'transparent',
                            }
                        }
                    }, // 卡片配置
                }
            }
        ]
    },
    {
        // 卡片样式
        cardStyle: {
            padding: "",
        },
        // 布局配置
        colLayout: {
            span: 24
        },
        data: [
            {
                cardId: 3,
                title: "",
                showSectionCondition: "",
                cardFilterOptions: [ // 卡片筛选项
                ],
                cardBodyConfig: {
                    type: "table", // 类型 echart/table
                    url: "/cardBodyAddressTable1", // 接口地址
                    style: {
                        height: 260
                    }, // 卡片主体样式
                    config: {
                        // 是否显示序号
                        showIndexColumn: true,
                        // 是否显示可选
                        showSelectColumn: false,
                        // 是否显示分页
                        showFooter: false,
                        // 表格数据
                        propsList: [
                            { prop: 'key1', label: '区域名称2', align: 'left' },
                            { prop: 'key2', label: '来源地区名称2', align: 'left' },
                            { prop: 'key3', label: '游客数', align: 'left' },
                            { prop: 'key4', label: '操作', align: 'left' },
                        ],
                        // 表格配置项
                        tableAttrConfig: {
                            // 是否显示边框
                            border: true,
                            // 是否显示统计
                            showSummary: false,
                            headerCellStyle: {
                                background: 'rgba(18, 68, 87, 0.54)',
                                color: '#fff',
                                fontFamily: 'PingFang SC',
                                fontSize: '12px',
                                fontStyle: 'normal',
                                fontWeight: '400',
                                borderRadius: "3px",
                                // borderRight: "2px solid #091520",
                                // boxSizing: "border-box"
                            },
                            cellStyle: {
                                fontSize: "12px",
                                color: "#BCCBCC",
                                backgroundColor: 'transparent',
                            }
                        }
                    }, // 卡片配置
                }
            }
        ]
    }
]